<template>
	<view>
		<uni-nav-bar title="添加好友" :statusBar="true" :border="false" left-icon="back" :fixed="true"
			@clickLeft="$tab.back()">
		</uni-nav-bar>
		<u-line color="#F8F8F8"></u-line>
		<view class="px-20 pt-12 pb-24 bg-FFF">
			<u-search placeholder="请输入手机号/用户名/昵称" v-model="keyword" @custom="search"></u-search>
		</view>
		
		<view class="px-20">
			<view class="flex items-center justify-between mt-40" v-for="item in userList" :key="item.userId">
				<view class="flex items-center">
					<image :src="item.avatar" class="image-80 round" mode=""></image>
					<view class="text-32 font-500 ml-20">
						{{ item.nickName }}
					</view>
				</view>
				<view class="add text-center text-32 text-FFF" @click="$tab.nav(`/pages/chat2/addFriend?userName=${item.userId}`)">
					添加
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				keyword:"",
				userList:[],
			};
		},
		onLoad() {
			// #ifdef MP-WEIXIN
			wx.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage']
			})
			// #endif
		},
		methods:{
			async search(){
				const res = await this.$Api.chat.searchUser({
					keyword:this.keyword 
				})
				console.log('添加好友的搜索',res)
				this.userList = res.data
			}
		}
	}
</script>

<style lang="scss">
	.add{
		width: 180rpx;
		height: 80rpx;
		background: #FF323B;
		line-height: 80rpx;
	}
</style>
